<?php echo $header; ?>
<body>
<!-- website wrapper starts -->
<div class="websiteWrapper"> 
  <!-- page wrapper starts -->
  <div class="pageWrapper homePageWrapper"> 
    <!-- main menu outer wrapper starts -->
    <div class="mainMenuOuterWrapper"> 
      <!-- main menu wrapper starts -->
      <ul class="mainMenuWrapper">
        <li class="currentPage"><a href="index.html">Home</a></li>
        <li><a href="typography.html">About</a> </li>
        <li><a href="faq.html">FAQ Page</a></li>
        <li><a href="404.html">404 Page</a></li>
        <li><a href="register.html">Register</a></li>
        <li><a href="recover.html">Recover Account</a></li>
        <li><a href="login.html">Login</a></li>
        <li><a href="advancedSearch.html">Advanced Search</a></li>
        <li><a href="singleProduct.html">Single Product</a></li>
        <li><a href="checkout.html">Checkout</a></li>
        <li><a href="portfolioOneColumn.html">Portfolio One</a></li>
        <li><a href="portfolioTwoColumns.html">Portfolio Two</a></li>
        <li><a href="portfolioOneColumnFilterable.html">Filterable Portfolio One</a></li>
        <li><a href="portfolioTwoColumnsFilterable.html">Filterable Portfolio Two</a></li>
        <li><a href="singleProject.html">Single Portfolio Project</a></li>
        <li><a href="blog.html">Blog</a> </li>
        <li><a href="singlePost.html">Single Post</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <!-- main menu wrapper ends -->
      <div class="mainMenuBottomDecoration"></div>
    </div>
    <!-- main menu outer wrapper ends --> 
    
   <?php echo $topcart; ?>
    
    <!-- header outer wrapper starts -->
    <div class="headerOuterWrapper">
      <div class="headerWrapper"> <a id="jsurl" href="<?php echo $login; ?>" class="accountButton"></a><a href="" class="shoppingCartButton"></a><a href="" class="mainMenuButton"></a></div>
      <div class="headerDecoration"></div>
      
      <!-- main logo starts --> 
      <a href="" class="mainLogo"><img src="catalog/view/theme/diancan/images/common/mainLogo.png" alt="" /></a> 
      <!-- main logo ends --> 
    </div>
    <!-- header outer wrapper ends --> 
    
    <!-- page content wrapper starts -->
    <div class="pageContentWrapper"> 
      
      <!-- shop search form wrapper starts -->
      <div class="shopSearchFormWrapper">
        <form action="#" method="post" id="shopSearchForm">
          <fieldset>
            <input type="text" value="" id="shopSearchField" class="shopSearchField fieldWithIcon shopSearchFieldIcon" name="shopSearchField" placeholder="search..." />
          </fieldset>
        </form>
      </div>
      <!-- shop search form wrapper ends --> 
      
      <!-- slider wrapper starts -->
      <div class="sliderOuterWrapper">
        <div class="sliderWrapper">
          <div class="mainSlider" id="mainSlider">
          
           <a href=""><img src="catalog/view/theme/diancan/images/content/slide-1.jpg" alt="" /></a> 
           <a href=""><img src="catalog/view/theme/diancan/images/content/slide-2.jpg" alt="" /></a>
          
          <a href=""><img src="catalog/view/theme/diancan/images/content/slide-3.jpg" alt="" /></a>
           </div>
           
        </div>
        
        <a href="" class="sliderControl previousSlideButton"></a> <a href="" class="sliderControl nextSlideButton"></a> </div>
      <!-- slider wrapper ends -->
      
      <div class="textBreakBottom"></div>
      <a id="jsurl" href="<?php echo $category; ?>" class="singleProductPurchaseButton">开始点餐</a>

      <div class="pageBreak"></div>
      
      <!-- accordion wrapper starts -->
      <div class="accordionWrapper"> 
        <!-- accordion item wrapper starts -->
        <div class="accordionItemWrapper"> <a href="" class="accordionButton"><span class="accordionButtonIcon"></span><span class="accordionButtonTitle">How many pages are included?</span></a>
          <div class="accordionContentWrapper">
            <div class="accordionContent">
              <p>This template has 18 unique pages.</p>
            </div>
          </div>
        </div>
        <!-- accordion item wrapper ends --> 
        <!-- accordion item wrapper starts -->
        <div class="accordionItemWrapper"> <a href="" class="accordionButton"><span class="accordionButtonIcon"></span><span class="accordionButtonTitle">How many PSD files do I get?</span></a>
          <div class="accordionContentWrapper">
            <div class="accordionContent">
              <p>Yes, a complete PSD is included for the home page, and many other secondary PSD files used to create all the elements for this template.</p>
            </div>
          </div>
        </div>
        
        <!-- accordion item wrapper ends --> 
        <!-- accordion item wrapper starts -->
        <div class="accordionItemWrapper"> <a href="" class="accordionButton"><span class="accordionButtonIcon"></span><span class="accordionButtonTitle">I need help, what can I do?</span></a>
          <div class="accordionContentWrapper">
            <div class="accordionContent">
              <p>A complete guide is included with this template, and all the code is properly commented. All assets are well organized and easy to find.</p>
              <p>You can also contact us if you have any problems or want us to customize it for you.</p>
            </div>
          </div>
        </div>
        <!-- accordion item wrapper ends --> 
      </div>
      <!-- accordion wrapper ends --> 
      
    </div>
    <!-- page content wrapper ends -->
    <div class="footerDecoration"></div>
    <!-- footer wrapper starts -->
    <div class="footerWrapper"> <span class="copyright">&copy; copyright shopey.</span> <span class="footerLinksWrapper"><a href="" class="footerLink">Help</a><a href="" class="footerLink">Terms</a></span> </div>
    <!-- footer wrapper ends --> 
    
  </div>
  <!-- page wrapper ends --> 
</div>

<!-- website wrapper ends -->

</body>

</html>

